<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>清单列表</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="../../css/mui.min.css">
		<link rel="stylesheet" href="../../css/app.css">
		<style>
			body{width: 100%;}
			.mui-bar-nav~.mui-content{padding:0;position:absolute;width:7.5rem;height:100%;top:0;left:0;z-index:1000;background-color:transparent;}
			/*切换菜单*/
			.mui-slider{position:relative;}
			/*办事列表*/
			.mui-table-view{width:100%;float:left;padding:0;margin:0;background:transparent;}
			.mui-table-view>dd{width:7.5rem;overflow:hidden;padding:.35rem .25rem;/*margin:0 0 .2rem 0;*/margin:0;border-bottom: 0.01rem solid #EEEEEE;background:#fff;box-sizing:border-box;}
			.mui-table-view>dd .title_top{width:100%;float:left;}
			.title_top .title_top_text{width:6.45rem;float:left;overflow:hidden;white-space:nowrap;display:block;text-overflow:ellipsis;font-size:.30rem;color:#333;}
			.title_top .mui-icon-arrowdown{float:right;margin-top:-.02rem;font-size:.4rem;;}
			.title_bottom{display:none;width:100%;background:#f3f3f3;border-radius:.08rem;margin-top:.2rem;padding:.2rem .25rem;box-sizing:border-box;float:left;}
			.title_bottom>a{width:100%;color:#333;font-size:.30rem;display:block;padding:.1rem 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
			.title_bottom>a>i{display:block;width:.15rem;height:.15rem;background:url(../../images/work/fab.png) no-repeat;background-size:100% auto;float:left;margin:.15rem .1rem 0 0;}
			.banshi_active .title_bottom{display:block;}
			.banshi_active .mui-icon-arrowdown{color:#4072fd;margin-top:-.02rem;}
			.banshi_active .mui-icon-arrowdown:before{content:'\e580';}
			.mui-bar-nav~.mui-content .mui-pull-top-pocket{top:.2rem;}
			.mui-pull-bottom-pocket, .mui-pull-top-pocket{visibility: visible;}
			.mui-table-view:after{content: none;}
			.mui-pull{position: relative;margin-top: 15px;}
		</style>
	</head>
	<body>
		<div id="scroll" class="mui-content mui-scroll-wrapper">
			<div class="mui-scroll">
			<ul class="mui-table-view mui-table-view-chevron">
				<li class="mui-table-view" id="muiScrollDivUl">
				</li>
			</ul>
			</div>
		</div>
		<script>
			function my_immersed(immersed){
			}
		</script>
		<script src="../../js/immersed.js"></script>
		<script src="../../js/mui.min.js"></script>
		<script src="../../js/common.js"></script>
		<script src="../../js/jquery2.2.4.min.js"></script>
		<script src="../../js/app.js"></script>
		<script>
		    mui.init({
				pullRefresh: {
					container: '#scroll',
					up: {
						contentrefresh: '正在加载...',
						auto:true,//可选,默认false.自动上拉加载一次
			            contentnomore:'没有更多数据了',//可选，请求完毕若没有更多数据时显示的提醒内容；
						callback: pullupRefresh
					}
				}
			});
			
			var pageNum = 0;//刷新并显示第一页
			var pageSize = 20;//每页显示数量
			var maxPageNumber = 1;//最大页数
			var districtId = getCurrentDistrictId();
			var sxlx = "";
			var fwbm = "";
			var serviceType = "";
			
			$(function(){ 
			     //获取上一个页面传过来的参数开始
				fwbm = utils.getUrlParam('fwbm');
				sxlx = utils.getUrlParam('sxlx');
				serviceType = utils.getUrlParam('serviceType');
			});
			
			/**
			 * 上拉加载具体业务实现
			 */
			function pullupRefresh() {
				pageNum++;//翻下一页
		        if(pageNum<=maxPageNumber){
		       		upRefresh(districtId,fwbm,sxlx,pageNum,pageSize);//具体取数据的方法
		        }else{
		        		mui('#scroll').pullRefresh().endPullupToRefresh(true);
		        }
			}
			
			
			function upRefresh(){
				if(sxlx == undefined || sxlx == null || sxlx == 'null'){
					sxlx = "";
				}
				if(fwbm == undefined || fwbm == null || fwbm == 'null'){
					fwbm = "";
				}
				var param = 'districtId=' + districtId + '&fwbm=' + fwbm + '&sxlx=' + sxlx + '&serviceType=' + serviceType + '&siteId='+getCurrentSiteId()+'&pageSize=' + pageSize+ '&pageNumber=' + pageNum;
				var url = 'appHttpService/appQlqdServiceList.do';
				utils.ajax(url, function(data) {
					data = JSON.parse(data);
					if(data.code == 0) {
						if(data.maxPageNumber != undefined){
							maxPageNumber = data.maxPageNumber;
						}
						
						var temp = JSON.parse(data.result);
						var fragment = document.createDocumentFragment();
						if(temp != null && temp.length > 0){
							for(var i in temp) {
								var dd = document.createElement('dd');
								var temp_html = "";
								temp_html += "<div class='title_top'>" +
									"<a class='title_top_text'>" + temp[i].directoryName.trim() + "</a>" +
									"<span class='mui-icon mui-icon-arrowdown'></span>" +
									"</div>" 
									//是否存在小项 0是 1否
									if(temp[i].existChildItem == 0){
										if(temp[i].sxDirectoryChildList.length>0){
										  		var sxDirectoryChildHtml="";
												for(var j in temp[i].sxDirectoryChildList){
													sxDirectoryChildHtml +="<a parentExistChildItem="+temp[i].existChildItem+"  id="+temp[i].sxDirectoryChildList[j].oid+"><i></i>" + temp[i].sxDirectoryChildList[j].directoryName + "</a>" ;
												}
												if(sxDirectoryChildHtml != ''){
													temp_html +="<div class='title_bottom'>"+sxDirectoryChildHtml+"</div>";
												}
										 }
									}else if(temp[i].existChildItem == 1){
										if(temp[i].serviceList.length>0){
										 	var serviceListHtml="";
											for(var k in temp[i].serviceList){
												serviceListHtml +="<a parentExistChildItem="+temp[i].existChildItem+" id='"+temp[i].serviceList[k].serviceOid+"'><i></i>" + temp[i].serviceList[k].serviceName+ "</a>" ;
											}
											if(serviceListHtml != ''){
												temp_html +="<div class='title_bottom'>"+serviceListHtml+"</div>";
											}
									  	}
									}
							    dd.innerHTML = temp_html;
								fragment.appendChild(dd);
							}
							document.getElementById("muiScrollDivUl").appendChild(fragment);
							if(data.total < pageSize){
								mui('#scroll').pullRefresh().endPullupToRefresh(true);
							}else{
								mui('#scroll').pullRefresh().endPullupToRefresh(false);
							}
						}else{
							mui('#scroll').pullRefresh().endPullupToRefresh(true);
						}
					}else{
						mui('#scroll').pullRefresh().endPullupToRefresh(true);
					}
				}, param);
			}
			
		    /**
             * 点击大项展示办理项或者小项
             */
			mui("body").on('tap','.title_top',function(){
	            if($(this).parents('dd').hasClass('banshi_active')){
	            	$(this).parents('dd').removeClass('banshi_active');
	            	 $('.title_bottom').hide();
	            }else{
	            	$('.mui-scroll>ul>li>dd').removeClass('banshi_active');
            	    $(this).parents('dd').addClass('banshi_active');
            	    $('.title_bottom').hide();
	            	$(this).parents('dd').find('.title_bottom').slideDown(200);
	            }
            })
			
			/**
             * 查看详情页面
             */
			mui("body").on('tap','.title_bottom a',function(){
	            if(this.getAttribute('parentExistChildItem') == 0){//目录清单详情
	            	utils.showWaiting();
					var directoryOid = this.getAttribute('id');
					localStorage.setItem("directoryOid",directoryOid);
					localStorage.setItem("districtId",districtId);
					localStorage.setItem("userType","");
					showTemplates('../work/sxDirectory_detail.html','目录清单详情','../work/sxDirectory_detail.html');
	            }else{//事项清单详情
	            	utils.showWaiting();
	            	var hsw = openNewWin('_www/src/work/bszn_info.html?serviceOid=' + this.getAttribute("id"),{bounce:'none'}, 'bszn_info');
	            	mui.fire(hsw,'getDetail',{serviceOid:this.getAttribute("id")});
	            }
            })
			
			$(function(){ 
			  $('.mui-bar-nav~.mui-content').height($(window).height()+'px');
			});
	</script>
	</body>
</html>
